<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>segs</title>
    <script type="text/javascript" src="/js/jquery.min.js"></script>
    <script type="text/javascript" src="/js/bootstrap/js/bootstrap.js"></script>
    <script type="text/javascript" src="/js/bootstrap/js/bootstrapValidator.js"></script>
    <script type="text/javascript" src="/js/moment.js"></script>
    <script type="text/javascript"
            src="/js/jquery.form.js"></script>

    <!-- bootstrap-table.min.js -->
    <script src="/js/bootstrap-table/bootstrap-table.min.js"></script>
    <!-- 引入中文语言包 -->
    <script src="/js/bootstrap-table/bootstrap-table-zh-CN.min.js"></script>
    <link href="/css/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">

    <link rel="stylesheet" href="/js/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/bootstrap-datetimepicker.css">
    <script type="text/javascript" src="/js/jquery.sselect.js"></script>
    <script type="text/javascript" src="/js/bootstrap-datetimepicker.js"></script>
    <style type="text/css">
        * {margin: 0;padding: 0}
        .waper {=padding: 20px;=}
        caption {text-align: center;font-size: 24px;}
        table tr td {width: 250px;text-align: center;word-break: break-all; }
        .exe-info{margin: 5px 50px 5px 0; display: flex;justify-content: flex-end; align-items: center;}
    </style>
</head>
<body>
<div class="waper">
    <div class="info exe-info">
        <button class="btn btn-info" id="export">导出</button>
    </div>
    <table class="table" id="table">
        <caption>人员列表</caption>
        <tbody id="content">
        </tbody>
    </table>
</div>
</body>
<script type="text/javascript">
    $("#export").click(function () {
        var rowData = parent.rowData;
        window.location.href = '/cegs/exportDoorUserList?doorCode=' + rowData.doorCode + '&deviceNo=' + rowData.deviceNo + '&startDate=' + rowData.startDate + '&endDate=' + rowData.endDate;
    });
    $("#table").bootstrapTable({ // 对应table标签的id
        method: "post",
        url: "/cegs/getDoorUserList",
        cache: false, // 设置为 false 禁用 AJAX 数据缓存， 默认为true
        striped: true,  //表格显示条纹，默认为false
        pagination: true, // 在表格底部显示分页组件，默认false
        pageList: [1, 3], // 设置页面可以显示的数据条数
        pageSize: 5, // 页面数据条数
        pageNumber: 1, // 首页页码
        sidePagination: 'server',
        responseHandler: function (res) {
            return {
                total: res.data.total,
                rows: res.data.list
            };
        },
        queryParams: function (params) { // 请求服务器数据时发送的参数，可以在这里添加额外的查询参数，返回false则终止请求
            var rowData = parent.rowData
            return {
                pageSize: params.limit, // 每页要显示的数据条数
                offset: (params.offset / params.limit) + 1, // 每页显示数据的开始行号
                sort: params.sort, // 要排序的字段
                sortOrder: params.order, // 排序规则
                startDate: rowData.startDate,
                endDate: rowData.endDate,
                deviceNo: rowData.deviceNo,
                doorCode: rowData.doorCode
            }
        },
        // sortName: 'id', // 要排序的字段
        // sortOrder: 'desc', // 排序规则
        columns: [
            {
                field: 'name', // 返回json数据中的name
                title: '姓名', // 表格表头显示文字
                align: 'center', // 左右居中
                valign: 'middle' // 上下居中
            }, {
                field: 'cardno',
                title: '身份证号',
                align: 'center',
                valign: 'middle'
            },
            {
                field: 'doorCode',
                title: '病区编号',
                align: 'center',
                valign: 'middle'
            },
            {
                field: 'doorName',
                title: '病区名称',
                align: 'center',
                valign: 'middle'
            },
            {
                field: 'deviceNo',
                title: '设备编号',
                align: 'center',
                valign: 'middle'
            },
            {
                field: 'deviceName',
                title: '设备名称',
                align: 'center',
                valign: 'middle'
            }
        ]
    })

</script>
</html>